<div id="timer-picker-component-box">

    <a class="calendar" href="javascript:;" ng-click="vm.showCustom()" popover-placement="bottom-right" popover-is-open="true" popover-trigger="'mouseenter'" uib-popover="选择时间" popover-enable="{{!vm.showCustomTimer}}">
        <i class="fa fa-calendar cp"></i>
    </a>
    <!-- dropdown -->
    <span uib-dropdown class="pr10" ng-class="{'hide':vm.showCustomTimer}">
      <a href="javascript:;" id="timer-picker-dropdown" uib-dropdown-toggle>
        {{vm.dropdown.cur.text}}<i class="fa fa-caret-down pl4"></i>
      </a>
      <ul class="dropdown-menu" uib-dropdown-menu aria-labelledby="timer-picker-dropdown">
        <li bindonce ng-repeat="item in vm.dropdown.list track by $index" ng-click="vm.dropdown.onSelect(item,$index)">
          <a href="javascript:;" bo-text="item.text" ng-class="{'active':vm.dropdown.cur.text === item.text}"></a>
        </li>       
      </ul>
    </span>
    <!-- custom -->
    <form name="formPicker" class="formPicker" ng-class="{'show':vm.showCustomTimer}">
      <div class="input-field">
        <input type="text" class="pl5" ng-model="vm.custom.lowImportTime" datetime-picker date-format="yyyy-MM-dd" date-only placeholder="时间下限"> 至
        <input type="text" class="pl5" ng-class="{error:!formPicker.time.$valid && formPicker.time.$touched}" name="time" datetime-picker date-format="yyyy-MM-dd" date-only year="{{vm.custom.lowImportTime | year}}" month="{{vm.custom.lowImportTime | month}}" day="{{vm.custom.lowImportTime | day}}" ng-model="vm.custom.highImportTime" ng-compare compare-op='gteq' compare-to='vm.custom.lowImportTime' uib-tooltip="时间上限 不能小于 时间下限" tooltip-placement="top" tooltip-enable="{{formPicker.time.$invalid}}" placeholder="时间上限">
        <a href="javascript:;" class="btn-mini btn-default" ng-click="vm.custom.emit()" ng-class="{'disabled': formPicker.$invalid}">确定</a>
        </div>
    </form>
</div>
